<template>
	<view class="page-wraper">
		<view v-for="(indexItem,index) in data" :key="index">
			<view class="uni-list-item-box-data" @tap="tap_item(indexItem)">
				<image src="../../static/topimg.png" class="topp-zhiding-class" v-if="indexItem.topping == 1"></image>
				<view style="display: flex;flex-direction: row;justify-content: space-between;">
					<view class="uni-list-item-title">{{indexItem.model_name}}</view>
					<view class="tuijian_box" style="margin-top: 5rpx;" v-if="indexItem.recommend==1">推荐</view>
				</view>
				<view class="view-box-22 marginTop20">
					<view class="item-view-box-22" v-if="indexItem.appearance">{{indexItem.appearance}}</view>
					<view class="item-view-box-22" v-if="indexItem.area">{{indexItem.area}}</view>
					<view v-for="(item,index) in indexItem.notes" :key="index" class="item-view-box-22">{{item}}</view>
					<view class="item-view-box-22" v-if="indexItem.urgent_search==1">急寻</view>
				</view>
				<view class="item-content" v-if="indexItem.describe">{{indexItem.describe}}</view>
				<view class="item-number-time-box">
					<view class="item-numberQuote">已有{{indexItem.quotation_number}}家车商报价</view>
					<view class="item-time">{{indexItem.time}}</view>
				</view>
				<view class="item-line"></view>
				<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;">
					<view class="item-userName-box" style="flex: 1;">
						<image class="item-userName-image1" :src="indexItem.imageurl"></image>
						<view class="item-userName-text">{{indexItem.release}}</view>
						<image class="item-userName-image-geren" :src="indexItem.users_icon"></image>
						<!-- <image class="item-userName-image-gongsi" v-else src="@/static/gongsixinxi.png"></image> -->
						<image class="item-userName-image-gongsi" style="margin-left: 12rpx;" :src="indexItem.icon_url"
							v-if="indexItem.icon_url"></image>
					</view>
					<image src="../../static/memberbjz.png" style="width: 172rpx;height: 32rpx;"
						v-if="indexItem.member_quotations  == 1"></image>
				</view>

			</view>
		</view>
	</view>

</template>

<script>
	export default {
		name: "uniOrderList",
		props: {

			data: {
				type: Array,
				default: []
			}
		},
		data() {
			return {

			};
		},

		methods: {
			tap_item(item) {
				this.$emit('change', item)
			}
		}
	}
</script>

<style>
	.page-wraper {
		background-color: #00000000;
	}

	.item-line {
		width: 100%;
		height: 0rpx;
		border: 1px solid #00000003;
		margin-top: 18rpx;
	}

	.marginTop20 {
		margin-top: 20rpx;
	}

	.item-view-box-22 {
		width: auto;
		background: #EDF1FF;
		border-radius: 8rpx;

		text-align: center;
		font-size: 26rpx;
		font-family: Alibaba PuHuiTi;
		font-weight: 400;
		color: #0E59EA;
		opacity: 1;

		padding: 8rpx 30rpx;
		margin: 4rpx;
	}

	.view-box-22 {
		display: flex;
		flex-flow: row wrap;
		height: auto;
		width: 100%;
		align-items: center;
		justify-content: flex-start
	}

	.uni-list-item-box-data {
		margin-bottom: 12rpx;
		padding: 38rpx 24rpx 26rpx 28rpx;
		background-color: #FFFFFF;
		opacity: 1;
		border-radius: 14rpx;
		/* 父元素设置相对定位 */
		position: relative;
	}

	.uni-list-item-title {
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 32rpx;
		font-family: Alimama ShuHeiTi;
		font-weight: bold;
		color: #000026;
		opacity: 1;
		text-align: left;
		max-width: 500rpx;
	}

	.item-content {
		flex: 1;
		text-align: left;
		margin: 14rpx 0rpx;

		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
		opacity: 1;
	}

	.item-number-time-box {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.item-numberQuote {
		flex: 1;
		text-align: left;
		margin: 8rpx 0rpx;

		font-size: 22rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #D14141;
		opacity: 1;
	}

	.item-time {
		flex: 1;
		text-align: right;
		margin: 8rpx 0rpx;

		font-size: 22rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #999999;
		opacity: 1;
	}

	.item-userName-box {
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-top: 18rpx;
	}

	.item-userName-image1 {
		width: 44rpx;
		height: 44rpx;
		background: #E6E6E6;
		border-radius: 50%;
		opacity: 1;
	}

	.item-userName-text {
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
		opacity: 1;
		margin: 0rpx 12rpx;
	}

	.item-userName-image2 {
		width: 32rpx;
		height: 32rpx;
		background: #E6E6E6;
		border-radius: 50%;
		opacity: 1;
	}

	.item-userName-image-geren {
		width: 21.78rpx;
		height: 26.13rpx;
	}

	.item-userName-image-gongsi {
		width: 27.71rpx;
		height: 26.13rpx;
	}

	.tuijian_box {
		margin-right: 110rpx;
		width: 60rpx;
		height: 32rpx;
		color: #ffffff;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 20rpx;
		line-height: 32rpx;
		font-family: Alimama ShuHeiTi;
		background: linear-gradient(to right, #F56547, #E51A2E);
		white-space: nowrap;
	}
	
	.topp-zhiding-class{
		/* 设置绝对定位 */
		position: absolute;
		/* 距离父元素上边缘  */
		top: 0;
		right: 0;
		z-index: 1;
		width: 96rpx;
		height: 96rpx;
	}
</style>